/*************************
申诉界面
* */
<template>
  <div>
    <el-dialog
      title="事件考核申诉"
      :close-on-click-modal="true"
      :visible.sync="visible"
      top="8vh"
      width="70%"
      @close="closeDialog()"
    >
      <el-form ref="dataForm" :model="dataForm" :rules="rules" class="boxsty"  label-width="100px"  @keyup.enter.native="dataFormSubmit()"  >
        <el-form-item label="标题：" prop="sjbt">
          <span>{{dataForm.sjbt}}</span>
        </el-form-item>

        <el-form-item label="考核周期：" prop="khzq">
          <span>{{dataForm.khzq}}</span>
        </el-form-item>

        <el-form-item label="描述：" prop="sjdesc">
          <span>{{dataForm.sjdesc}}</span>
        </el-form-item>

        <el-form-item label="考核对象：">
          <el-table
            ref="multipleTable"
            :data="tableData"
            style="width: 100%;"
            tooltip-effect="dark"
          >
            <el-table-column type="index"   width="70" align="center" label="序号" ></el-table-column>

            <el-table-column
              v-if="showRY"
              prop="username"
              label="员工编号" min-width="120" align="center"  show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              v-if="showRY"
              prop="realname"
              label="姓名" min-width="120" align="center"  show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              v-if="showRY"
              prop="deptName"
              label="部门" min-width="120" align="center"  show-overflow-tooltip>
            </el-table-column>

            <el-table-column
              v-if="!showRY"
              prop="realname"
              label="机构名称"
              min-width="120" align="center"  show-overflow-tooltip>
            </el-table-column>

            <el-table-column
              prop="lbms"
              label="类别"  align="center" >
            </el-table-column>
            <el-table-column
              prop="yjms"
              label="依据"  align="center"  show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              prop="bz"
              label="标准" align="center"  show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              prop="zbgz"
              label="指标规则" align="center"  min-width="120" show-overflow-tooltip>
            </el-table-column>
            <el-table-column
              prop="jkfz"
              fixed="right"
              label="加扣分值" align="center"  min-width="120">
            </el-table-column>
            <el-table-column
              prop="xgfz"
              fixed="right"
              label="修改分值" align="center"  min-width="120">
              <template slot-scope="scope">
                {{scope.row.xgfz==null||scope.row.xgfz==""?"——":scope.row.xgfz}}
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>

        <el-form-item label="申诉理由：" prop="ssly">
          <el-input type="textarea" :rows="4" placeholder="请输入申诉理由" v-model="dataForm.ssly" clearable></el-input>
        </el-form-item>

      </el-form>

      <span slot="footer" class="dialog-footer">

         <el-button type="primary" plain @click="submitAppeal"  v-loading="isSubmit">提交申诉</el-button>
         <el-button type="primary" plain @click="closeDialog()">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
    import {subSs} from "@/api/dailyExamine/eventExamine/resultsLook.js";

    export default {
        data() {
            var checkSsly = (rule, value, callback) => {
                if (value) {
                    if (value.length>250) {
                        callback("最多可输入250个字符!");
                    } else {
                        callback();
                    }
                } else {
                    callback("请输入申诉理由");
                }
            };
            return {
                showRY:true,
               //khrNameList: [],
                visible: false,
                dataForm: {},
                tableData:[],
                isSubmit:false,
                rules:{
                    ssly: [{ validator:checkSsly,trigger: "blur"}]
                }
            };
        },
        watch: {},
        created() {},
        methods: {
            //初始化
            csh() {
                this.dataForm = {};
            },
            init(obj) {
                if (obj) {
                    this.dataForm = obj;
                    this.tableData.push(obj) ;
                    //this.khrNameList = obj.khrList;
                    this.showRY = obj.khtype=='ry'?true:false;
                    this.$nextTick(() => {
                        this.$refs.multipleTable.doLayout();
                    })
                }

                this.visible = true;
            },

            closeDialog() {
               // this.visible = false;
                this.$emit("closeAppealDialog");
            },
            submitAppeal(){
                this.isSubmit = true;
                this.$refs["dataForm"].validate(valid => {
                    let paramsObj = {
                        ssly:this.dataForm.ssly,
                        id:this.tableData[0].id
                    }
                    if (valid) {
                        subSs(paramsObj).then(r => {
                            console.log(r.data) ;
                            if (r.data.code == 0) {
                                this.isSubmit = false;
                                this.$emit("refreshDataList");
                                this.closeDialog();
                                this.$message.success("申诉成功");
                            }
                        });
                        //this.$emit("closeAppealDialog");
                    } else {
                        return false;
                    }
                });
            }
        }

    };
</script>
<style scoped>
  /deep/.boxsty{padding: 20px 30px!important;}
  /deep/.el-table th{padding: 5px!important;}

  .el-divider {
    background-color: #fff;
  }
  .tree-box {
    height: 500px;
    overflow: auto;
  }
</style>
